<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>三缺一</title>
    <style>
        .box {
            border-radius: 10px 10px 10px 10px;
            font-size: 13px;
            color: #555555;
            width: 666px;
            margin: 50px auto;
            border: 1px solid #eee;
            max-width: 100%;
            background: #ffffff repeating-linear-gradient(-45deg,#fff,#fff 1.125rem,transparent 1.125rem,transparent 2.25rem);
            box-shadow: 0 1px 5px rgb(0 0 0 / 15%);
        }
        .header {
            background:#49BDAD;
            color:#ffffff;
            border-radius: 10px 10px 0 0;
            background-image: -moz-linear-gradient(0deg, rgb(67, 198, 184), rgb(255, 209, 244));
            background-image: -webkit-linear-gradient(0deg, rgb(67, 198, 184), rgb(255, 209, 244));
            height: 66px;
        }
        .header p {
            font-size:15px;
            word-break:break-all;
            padding: 23px 32px;
            margin:0;
            background-color: hsla(0,0%,100%,.4);
            border-radius: 10px 10px 0 0;
        }
        .header p span {
            text-decoration:none;
            color: #ffffff;
        }

        .content {
            margin:20px auto;
            width:90%
        }
        .content .content-text {
            background: #fafafa repeating-linear-gradient(-45deg,#fff,#fff 1.125rem,transparent 1.125rem,transparent 2.25rem);
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
            margin:20px 0;
            padding:15px;
            border-radius:5px;
            font-size:14px;
        }
        .content a {
            text-decoration:none;
            color:#12addb
        }
        .content .intro {
            color: #8c8c8c; font-size: 10px;width: 100%;text-align: center;word-wrap: break-word;
        }
    </style>
</head>
<body>
<div class="box">
    <div class="header">
        <p>
            您的<span th:text="|${title}|"></span>有的新评论啦！
        </p>
    </div>
    <div class="content">
        <p>时间：<span th:text="${time}"></span></p>
        <p><strong th:text="${nickname}"></strong> 同学 给您的评论如下：</p>
        <div class="content-text">
            <p th:utext="${content}"></p>
        </div>
        <p>
            您可以点击<a th:href="@{${url}}" target="_blank">查看回复的完整內容</a>
        </p>
        <div class="intro">
            <p style="padding: 20px">什么都无法舍弃的人，什么都改变不了。——《进击的巨人》</p>
        </div>
    </div>
</div>
</body>
</html>